<template>
  <div class="app-container">
    <el-row>
      <el-col :span="4">
        <el-menu :default-active="activeMenuIndex" id="menu" mode="vertical"
                 @open="handleMenuOpen"
                 @select="handleItemSel"
                 unique-opened
        >
          <MultiLevelMenu
            v-for="(firstItem, firstIndex) in menu"
            :key="firstIndex"
            :item="firstItem"
            :index="String(firstIndex)"
            :level="1"
          />
        </el-menu>
      </el-col>
      <el-col :span="20">
        <el-form :model="productQueryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
                 label-width="68px"
        >
          <el-form-item label="产品名称" prop="keyword">
            <el-input v-model="productQueryParams.keyword" placeholder="请输入产品名称" clearable
                      @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="审核状态" prop="status">
            <el-select
              v-model="productQueryParams.status"
              placeholder="请选择"
              clearable
              @change="handleStatusSel"
              @keyup.enter.native="handleQuery"
            >
              <el-option label="审核失败" :value="-2" />
              <el-option label="保存" :value="-1" />
              <el-option label="正常（上架）" :value="0" />
              <el-option label="故障（下架）" :value="1" />
              <el-option label="未审核" :value="2" />
              <el-option label="未测试" :value="3" />
            </el-select>
          </el-form-item>
          <el-form-item label="产品类型" prop="sourceType">
            <el-select
              v-model="productQueryParams.sourceType"
              placeholder="请选择"
              clearable
              @keyup.enter.native="handleQuery"
              @change="handleSourceTypeSel"
            >
              <el-option label="在线数据产品" :value="1" />
              <el-option label="套餐数据产品" :value="2" />
              <el-option label="算法产品" :value="3" />
              <el-option label="离线数据产品" :value="4" />
              <el-option label="应用产品" :value="5" />
            </el-select>
          </el-form-item>
          <el-form-item label="平台" prop="platform">
            <el-select
              v-model="productQueryParams.platform"
              placeholder="请选择"
              clearable
              @keyup.enter.native="handleQuery"
              @change="handleSourceTypeSel"
            >
              <el-option label="成都大学平台" :value="1" />
              <el-option label="崇州平台" :value="2" />
<!--              <el-option label="算法产品" :value="3" />-->
<!--              <el-option label="离线数据产品" :value="4" />-->
<!--              <el-option label="应用产品" :value="5" />-->
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
                       v-hasPermi="['dataProduct:add']"
            >新增
            </el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
                       v-hasPermi="['dataProduct:edit']"
            >修改
            </el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
                       v-hasPermi="['dataProduct:remove']"
            >删除
            </el-button>
          </el-col>
          <!-- <el-col :span="1.5">
            <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['dataProduct:export']">导出</el-button>
          </el-col> -->
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getProductList"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="DataProductList" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column type="index" width="50" align="center" label="序号"></el-table-column>
          <el-table-column label="产品名称" align="center" prop="productName" />
          <el-table-column label="所属平台" align="center" prop="platform" />
          <el-table-column label="当前状态" align="center" prop="status">
            <template slot-scope="scope">
              <span v-if="scope.row.status == -2">审核失败</span>
              <span v-else-if="scope.row.status == -1">保存</span>
              <span v-else-if="scope.row.status == 0">正常(上架)</span>
              <span v-else-if="scope.row.status == 1">故障(下架)</span>
              <span v-else-if="scope.row.status == 2">未审核</span>
              <span v-else-if="scope.row.status == 3">未测试</span>
            </template>
          </el-table-column>
          <el-table-column label="产品类型" align="center" prop="sourceType">
            <template slot-scope="scope">
              <span v-if="scope.row.sourceType == 1">在线数据产品</span>
              <span v-else-if="scope.row.sourceType == 2">套餐数据产品</span>
              <span v-else-if="scope.row.sourceType == 3">算法产品</span>
              <span v-else-if="scope.row.sourceType == 4">离线数据产品</span>
              <span v-else-if="scope.row.sourceType == 5">应用产品</span>
            </template>
          </el-table-column>

          <el-table-column label="产品定义" align="center" prop="definition" :show-overflow-tooltip="true" />

          <el-table-column label="简介" align="center" prop="brief" />
          <el-table-column label="详细介绍" align="center" prop="detaile" />
          <el-table-column label="编程说明" align="center" prop="programming" />
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
                         v-hasPermi="['dataProduct:edit']" v-if="scope.row.status=='0' ? false :true"
              >修改
              </el-button>
              <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                         v-hasPermi="['dataProduct:remove']"
              >删除
              </el-button>
<!--              <el-button size="mini" type="text" icon="el-icon-s-promotion" @click="handleExecute(scope.row)">测试-->
<!--              </el-button>-->
              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUp(scope.row)"
                         v-if="(scope.row.status === 1 || scope.row.status === 0) ? true : false"
              >{{ scope.row.status === 1 ? '上架' : '下架' }}
              </el-button>
              <el-button v-if="scope.row.status == 0 && scope.row.sourceType == 1" size="mini" type="text" icon="el-icon-document" @click="handleSee(scope.row)">查看详情
              </el-button>
            </template>
          </el-table-column>

        </el-table>

        <pagination v-show="total>0" :total="total" :page.sync="productQueryParams.pageNum"
                    :limit.sync="productQueryParams.pageSize" @pagination="getProductList"
        />
      </el-col>
    </el-row>
    <!-- 添加或修改引对话框 -->
    <el-dialog :title="updateTitle" :visible.sync="updateOpen" width="1200px" append-to-body>
      <el-form ref="productForm" :model="productForm" :rules="productRules" label-width="100px">
        <el-form-item label="产品类别" prop="sourceType">
          <el-radio-group v-model="productForm.sourceType">
            <el-radio v-model="productForm.sourceType" :label="1" :disabled="disabled" checked>在线数据产品</el-radio>
            <el-radio v-model="productForm.sourceType" :label="2" :disabled="disabled">套餐数据产品</el-radio>
            <el-radio v-model="productForm.sourceType" :label="3" :disabled="disabled">算法产品</el-radio>
            <el-radio v-model="productForm.sourceType" :label="4" :disabled="disabled">离线数据产品</el-radio>
            <el-radio v-model="productForm.sourceType" :label="5" :disabled="disabled">应用产品</el-radio>
            <el-radio v-model="productForm.sourceType" :label="6" :disabled="disabled">混合产品</el-radio>
          </el-radio-group>
        </el-form-item>
        <!-- 在线数据产品 -->
        <div v-if="productForm.sourceType!==6">
          <el-row>
            <el-col :span="productForm.sourceType===2?24:12">
              <el-form-item label="产品名称" prop="productName">
                <el-input v-model="productForm.productName" placeholder="" />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="productForm.sourceType===1">
              <el-form-item label="数据通道" prop="dataSource">
                <el-select v-model="productForm.sourceId" filterable placeholder="请选择数据通道">
                  <el-option
                    v-for="item in dataSourceList"
                    :key="item.id"
                    :label="item.resourceName"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="productForm.sourceType===4">
              <el-form-item label="离线数据通道" prop="offlineFileUrl">
                <UploadFileOrPic type="file" :form-object="productForm" form-key="offlineFileUrl" />
                <!--                <el-input v-model="productForm.offlineFileUrl" placeholder="选择文件" type="file"/>-->
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="productForm.sourceType===3">
              <el-form-item label="算法名称" prop="algName">
                <el-input v-model="productForm.algName" placeholder="" />
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="productForm.sourceType===5">
              <el-form-item label="混合套餐" prop="dataSource">
                <el-select v-model="productForm.productMixName" filterable placeholder="请选择混合套餐">
                  <el-option
                    v-for="item in productMixList"
                    :key="item.id"
                    :label="item.resourceName"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <FieldAndKeyword
            :form-object="productForm"
          />
          <el-row>
            <el-col :span="12">
              <el-form-item label="产品简介" prop="brief">
                <el-input v-model="productForm.brief" placeholder="请填写产品简介" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="详细说明" prop="detail">
                <el-input v-model="productForm.detail" placeholder="" type="textarea" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="产品定义" prop="definition">
                <el-input v-model="productForm.definition" placeholder="请填写产品定义" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="编程说明" prop="programming">
                <el-input v-model="productForm.programming" placeholder="请填写编程说明" type="textarea" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="允许试用" prop="isTry">
                <el-select v-model="productForm.isTry" placeholder="请选择" style="width:100%">
                  <el-option label="不允许" :value="0" />
                  <el-option label="允许" :value="1" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否自动人工审核：" prop="isAudit">
                <el-select v-model="productForm.isAudit" placeholder="请选择" style="width:100%">
                  <el-option label="不需要" :value="0" />
                  <el-option label="需要" :value="1" />
                </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row v-if="productForm.sourceType===3">
            <el-col :span="12">
              <el-form-item label="算法类别" prop="isTry">
                <el-select v-model="productForm.isTry" placeholder="请选择" style="width:100%">
                  <el-option label="静态函数" value="0" />
                  <el-option label="动态库" value="1" />
                  <el-option label="本机进程" value="2" />
                  <el-option label="远程算法平台" value="3" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要可信认证：" prop="isAudit">
                <el-select v-model="productForm.isTry" placeholder="请选择" style="width:100%">
                  <el-option label="不需要" value="0" />
                  <el-option label="需要" value="1" />
                </el-select>
              </el-form-item>
            </el-col>

          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否跨域" prop="isCross">
                <el-select v-model="productForm.isCross" placeholder="请选择" style="width:100%">
                  <el-option label="否" value="0" />
                  <el-option label="是" value="1" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="展示图标" prop="iconUrl">
                <!--                <el-input v-model="productForm.customFile" placeholder="选择文件" type="file"/>-->
                <UploadFileOrPic type="picture" :form-object="productForm" form-key="iconUrl" />
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 输入参数设置 -->
          <!--         <el-row v-if="productForm.sourceType!==2">-->
          <!--           <h3 style="margin-left:30px;font-weight:600;font-size:14px">输入参数设置</h3>-->
          <!--           <el-form-item>-->
          <!--             <el-table :data="productForm.dataproductParamList">-->
          <!--               <el-table-column type="index" width="50" align="center" label="序号"></el-table-column>-->
          <!--               <el-table-column label="参数名称" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramName"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column label="参数KEY" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramKey"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column label="参数类型" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramType"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column label="默认值" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramDefault"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--&lt;!&ndash;               <el-table-column label="是否可选" align="center" width="150">&ndash;&gt;-->
          <!--&lt;!&ndash;                 <template slot-scope="scope">&ndash;&gt;-->
          <!--&lt;!&ndash;                   <el-select v-model="productForm.chooseType" placeholder="请选择" style="width:100%">&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="否" value="0" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="是" value="1" />&ndash;&gt;-->
          <!--&lt;!&ndash;                   </el-select>&ndash;&gt;-->
          <!--&lt;!&ndash;                 </template>&ndash;&gt;-->
          <!--&lt;!&ndash;               </el-table-column>&ndash;&gt;-->
          <!--&lt;!&ndash;               <el-table-column label="关系类型" align="center" width="150">&ndash;&gt;-->
          <!--&lt;!&ndash;                 <template slot-scope="scope">&ndash;&gt;-->
          <!--&lt;!&ndash;                   <el-select v-model="productForm.relationshipType" placeholder="请选择" style="width:100%">&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="大于" value="1" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="小于" value="2" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="等于" value="0" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="包含" value="4" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="排除" value="8" />&ndash;&gt;-->
          <!--&lt;!&ndash;                   </el-select>&ndash;&gt;-->
          <!--&lt;!&ndash;                 </template>&ndash;&gt;-->
          <!--&lt;!&ndash;               </el-table-column>&ndash;&gt;-->
          <!--               <el-table-column label="备注" align="center" >-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.remark"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column-->
          <!--                 align="right">-->
          <!--                 <template slot="header" slot-scope="scope">-->
          <!--                   <el-button @click="handleInputParamAdd">新增</el-button>-->
          <!--                 </template>-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-button-->
          <!--                     size="mini"-->
          <!--                     @click="handleInputParamAdd(scope.$index, scope.row)">新增</el-button>-->
          <!--                   <el-button-->
          <!--                     size="mini"-->
          <!--                     type="danger"-->
          <!--                     @click="handleInputParamDelete(scope.$index, scope.row)">删除</el-button>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--             </el-table>-->
          <!--           </el-form-item>-->
          <!--         </el-row>-->
          <!--          &lt;!&ndash; 输出参数设置 &ndash;&gt;-->
          <!--         <el-row  v-if="productForm.sourceType!==2">-->
          <!--           <h3 style="margin-left:30px;font-weight:600;font-size:14px">输出参数设置</h3>-->
          <!--           <el-form-item>-->
          <!--             <el-table :data="exportParam">-->
          <!--               <el-table-column type="index" width="50" align="center" label="序号"></el-table-column>-->
          <!--               <el-table-column label="参数名称" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramName"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column label="参数KEY" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramKey"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column label="参数类型" align="center" width="150">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.paramType"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--&lt;!&ndash;               <el-table-column label="是否可选" align="center" width="150">&ndash;&gt;-->
          <!--&lt;!&ndash;                 <template slot-scope="scope">&ndash;&gt;-->
          <!--&lt;!&ndash;                   <el-select v-model="productForm.chooseType" placeholder="请选择" style="width:100%">&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="否" value="0" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="是" value="1" />&ndash;&gt;-->
          <!--&lt;!&ndash;                   </el-select>&ndash;&gt;-->
          <!--&lt;!&ndash;                 </template>&ndash;&gt;-->
          <!--&lt;!&ndash;               </el-table-column>&ndash;&gt;-->
          <!--&lt;!&ndash;               <el-table-column label="关系类型" align="center" width="150">&ndash;&gt;-->
          <!--&lt;!&ndash;                 <template slot-scope="scope">&ndash;&gt;-->
          <!--&lt;!&ndash;                   <el-select v-model="productForm.relationshipType" placeholder="请选择" style="width:100%">&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="大于" value="1" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="小于" value="2" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="等于" value="0" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="包含" value="4" />&ndash;&gt;-->
          <!--&lt;!&ndash;                     <el-option label="排除" value="8" />&ndash;&gt;-->
          <!--&lt;!&ndash;                   </el-select>&ndash;&gt;-->
          <!--&lt;!&ndash;                 </template>&ndash;&gt;-->
          <!--&lt;!&ndash;               </el-table-column>&ndash;&gt;-->
          <!--               <el-table-column label="备注" align="center">-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-input v-model="scope.row.remark"></el-input>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--               <el-table-column-->
          <!--                 align="right">-->
          <!--                 <template slot="header" slot-scope="scope">-->
          <!--                   <el-button @click="handleOutputParamAdd">新增</el-button>-->
          <!--                 </template>-->
          <!--                 <template slot-scope="scope">-->
          <!--                   <el-button-->
          <!--                     size="mini"-->
          <!--                     @click="handleOutputParamAdd(scope.$index, scope.row)">新增</el-button>-->
          <!--                   <el-button-->
          <!--                     size="mini"-->
          <!--                     type="danger"-->
          <!--                     @click="handleOutputParamDelete(scope.$index, scope.row)">删除</el-button>-->
          <!--                 </template>-->
          <!--               </el-table-column>-->
          <!--             </el-table>-->
          <!--           </el-form-item>-->
          <!--         </el-row>-->
          <el-row v-if="productForm.sourceType===2">
            <!-- 套餐产品设置 -->
            <h3 style="margin-left:30px;font-weight:600;font-size:14px">套餐产品设置</h3>
            <el-form-item>
              <el-table :data="productForm.productLinkList">
                <el-table-column type="index" width="50" align="center" label="序号"></el-table-column>
                <el-table-column label="产品选择" align="center">
                  <template slot-scope="scope">
                    <el-select v-model="scope.row.productId" filterable placeholder="请选择产品">
                      <el-option
                        v-for="item in dataProductList"
                        :key="item.id"
                        :label="item.productName"
                        :value="item.id"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-table-column>
                <el-table-column label="价格占比" align="center">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.packagePriceRatio" placeholder="%" type="number"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  align="right"
                >
                  <template slot="header" slot-scope="scope">
                    <el-button @click="handleProductAdd">新增</el-button>
                  </template>
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      @click="handleProductAdd(scope.$index, scope.row)"
                    >新增
                    </el-button>
                    <el-button
                      size="mini"
                      type="danger"
                      @click="handleProductDelete(scope.$index, scope.row)"
                    >删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
          </el-row>
          <h3 style="margin-left:30px;font-weight:600;font-size:14px">控制管理</h3>
          <el-form-item>
            <el-row v-if="productForm.sourceType===1">
              <el-radio :label="0" v-model="buyRuleType">继承数据通道规则</el-radio>
            </el-row>
            <el-row>
              <el-radio :label="-1" v-model="buyRuleType">自由使用</el-radio>
            </el-row>
            <el-row>
              <el-radio :label="1" v-model="buyRuleType">选择规则</el-radio>
              <template v-if="buyRuleType===1">
                <el-select v-model="productForm.buyRuleId" filterable placeholder="请选择规则">
                  <el-option
                    v-for="item in buyRuleList"
                    :key="item.id"
                    :label="item.systemBuyName"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-row>
          </el-form-item>
        </div>
        <!-- 复杂产品 -->
        <div v-if="productForm.sourceType===6">
          <el-form-item label="产品名称" prop="productName"
                        :rules='{ required: true, message: "产品名称不能为空", trigger: "blur" }'
          >
            <el-input v-model="form.productName" placeholder="" />
          </el-form-item>
          <el-form-item label="所属分类" v-model="AllProductTypeList">
            <el-checkbox-group v-model="form.typeIdList">
              <el-checkbox v-for="(item,index) in AllProductTypeList" :key="index" :label="item.id">
                {{ item.typeName }}
              </el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <el-form-item label="产品简介" prop="brief"
                        :rules='{ required: true, message: "产品简介不能为空", trigger: "blur" }'
          >
            <el-input v-model="form.brief" placeholder="" />
          </el-form-item>
          <el-form-item label="详细说明" prop="detaile"
                        :rules='{ required: true, message: "详细说明不能为空", trigger: "blur" }'
          >
            <el-input v-model="form.detaile" placeholder="" type="textarea" />
          </el-form-item>
          <!-- 价格设置 -->
          <h3 style="margin-left:30px;font-weight:600;font-size:14px">价格设置</h3>
          <el-form-item>
            <el-form :rules="rules" :inline="true" v-model="form.dataproductPriceList">
              <div v-for="(item, index) in form.dataproductPriceList" :key="index">
                <el-form-item label="特定用户" :prop="'dataproductPriceList.' + index + '.userId'" style="width:10%">
                  <el-select placeholder="请选择" v-model="form.dataproductPriceList[index].userId">
                    <el-option v-for="(item,index) in AllUserInfoList" :key="index" :label="item.nickName"
                               :value="item.userId"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item label="用户类型" :prop="'dataproductPriceList.' + index + '.userType'" style="width:11%">
                  <el-select v-model="item.userType" placeholder="请选择">
                    <el-option label="个人" :value="0" />
                    <el-option label="私人企业" :value="1" />
                    <el-option label="国有重点企业" :value="2" />
                    <el-option label="组织机构" :value="3" />
                    <el-option label="事业单位" :value="4" />
                    <el-option label="普通局委办" :value="5" />
                    <el-option label="权力机构" :value="6" />
                  </el-select>
                </el-form-item>
                <el-form-item label="用户级别" :prop="'dataproductPriceList.' + index + '.userLevel'" style="width:11%">
                  <el-select v-model="item.userLevel" placeholder="请选择">
                    <el-option label="最低级用户" :value="0" />
                    <el-option label="低级用户" :value="1" />
                    <el-option label="中级用户" :value="2" />
                    <el-option label="高级用户" :value="3" />
                    <el-option label="最高级用户" :value="4" />
                  </el-select>
                </el-form-item>
                <el-form-item label="计费类别" :prop="'dataproductPriceList.' + index + '.billingType'"
                              style="width:11%"
                >
                  <el-select v-model="item.billingType" placeholder="请选择">
                    <el-option label="按次数" :value="0" />
                    <el-option label="按记录数" :value="2" />
                    <el-option label="按字节" :value="3" />
                    <el-option label="按时长" :value="4" />
                  </el-select>
                </el-form-item>
                <el-form-item label="使用周期" :prop="'dataproductPriceList.' + index + '.usePeriod'" style="width:11%">
                  <el-input v-model="item.usePeriod" placeholder="使用周期"></el-input>
                </el-form-item>
                <el-form-item label="计费单位" :prop="'dataproductPriceList.' + index + '.productUnit'"
                              style="width:11%"
                >
                  <el-input v-model="item.productUnit" placeholder="计费单位" />
                </el-form-item>
                <el-form-item label="价格" :prop="'dataproductPriceList.' + index + '.price'" style="width:11%">
                  <el-input v-model="item.price" placeholder="价格金额" />
                </el-form-item>
                <el-form-item label="说明" :prop="'dataproductPriceList.' + index + '.remark'" style="width:11%">
                  <el-input v-model="item.remark" placeholder="描述说明" />
                </el-form-item>
                <el-form-item style="width:40px">
                  <i class="el-icon-circle-plus" @click="addPriceList()" style="font-size:20px;margin-right:10px"></i>
                  <i class="el-icon-remove" @click="deletePriceList(item, index)" style="font-size:20px"></i>
                </el-form-item>
              </div>
            </el-form>
            <!-- <el-button @click="addPriceList" type="primary">增加</el-button> -->
          </el-form-item>
          <!-- 访问控制 -->
          <h3 style="margin-left:30px;font-weight:600;font-size:14px">访问控制</h3>
          <el-form-item>
            <el-form :rules="rules" :inline="true" v-model="form.dataproductControlList">
              <div v-for="(item, index) in form.dataproductControlList" :key="index">
                <el-form-item label="特定用户" :prop="'dataproductControlList.' + index + '.userId'" style="width:14%">
                  <el-select v-model="form.dataproductControlList[index].userId" placeholder="请选择">
                    <el-option v-for="(item,index) in AllUserInfoList" :key="index" :label="item.nickName"
                               :value="item.userId"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item label="用户类型" :prop="'dataproductControlList.' + index + '.userType'"
                              style="width:15%"
                >
                  <el-select v-model="item.userType" placeholder="请选择">
                    <el-option label="个人" :value="0" />
                    <el-option label="私人企业" :value="1" />
                    <el-option label="国有重点企业" :value="2" />
                    <el-option label="组织机构" :value="3" />
                    <el-option label="事业单位" :value="4" />
                    <el-option label="普通局委办" :value="5" />
                    <el-option label="权力机构" :value="6" />
                  </el-select>
                </el-form-item>
                <el-form-item label="用户级别" :prop="'dataproductControlList.' + index + '.userLevel'"
                              style="width:15%"
                >
                  <el-select v-model="item.userLevel" placeholder="请选择">
                    <el-option label="最低级用户" :value="0" />
                    <el-option label="低级用户" :value="1" />
                    <el-option label="中级用户" :value="2" />
                    <el-option label="高级用户" :value="3" />
                    <el-option label="最高级用户" :value="4" />
                  </el-select>
                </el-form-item>
                <el-form-item label="共享类型" :prop="'dataproductControlList.' + index + '.sharedType'"
                              style="width:15%"
                >
                  <el-select v-model="item.sharedType" placeholder="请选择">
                    <el-option label="无条件共享" :value="0" />
                    <el-option label="需要授权" :value="1" />
                    <el-option label="需要确权" :value="2" />
                    <el-option label="需要确认授权" :value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="查询可见" :prop="'dataproductControlList.' + index + '.isVisible'"
                              style="width:15%"
                >
                  <el-select v-model="item.isVisible" placeholder="请选择">
                    <el-option label="可见" :value="0" />
                    <el-option label="不可见" :value="1" />
                  </el-select>
                </el-form-item>
                <el-form-item label="说明" :prop="'dataproductControlList.' + index + '.remark'" style="width:15%">
                  <el-input v-model="item.remark" placeholder="例如:针对张三" />
                </el-form-item>
                <el-form-item style="width:40px">
                  <i class="el-icon-circle-plus" @click="addControlList()" style="font-size:20px;margin-right:10px"></i>
                  <i class="el-icon-remove" @click="deleteControlList(item, index)" style="font-size:20px"></i>
                </el-form-item>
              </div>
            </el-form>
            <!-- <el-button @click="addControlList" type="primary">增加</el-button> -->
          </el-form-item>

          <!-- 产品设置 -->
          <h3 style="margin-left:30px;font-weight:600;font-size:14px">产品设置</h3>
          <el-form-item>
            <el-form :rules="rules" :inline="true" v-model="form.productLinkList">
              <div v-for="(item, index) in form.productLinkList" :key="index">
                <el-form-item label="产品选择" :prop="'datasourceDefaultPriceList.' + index + '.productSonId'"
                              :rules="{}" style="width:45%"
                >
                  <el-select v-model="item.productSonId" placeholder="请选择">
                    <el-option v-for="item in AllDataProductList" :key="item.id" :label="item.productName"
                               :value="item.id"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item label="价格占比" :prop="'datasourceDefaultPriceList.' + index + '.packagePriceRatio'"
                              :rules="{}" style="width:48%"
                >
                  <el-input v-model="item.packagePriceRatio" placeholder="">
                    <i slot="suffix">%</i>
                  </el-input>
                </el-form-item>
                <el-form-item style="width:40px">
                  <i class="el-icon-circle-plus" @click="addLinkList()" style="font-size:20px;margin-right:10px"></i>
                  <i class="el-icon-remove" @click="deleteLinkList(item, index)" style="font-size:20px"></i>
                </el-form-item>
              </div>
            </el-form>
            <!-- <el-button @click="addLinkList" type="primary">增加</el-button> -->
          </el-form-item>
          <!-- 扩展控制 -->
          <h3 style="margin-left:30px;font-weight:600;font-size:14px">扩展控制</h3>
          <el-form-item>
            <el-form :rules="rules" :inline="true" v-model="form.dataproductExtendList">
              <div v-for="(item, index) in form.dataproductExtendList" :key="index">
                <el-form-item label="用户类型" :prop="'dataproductExtendList.' + index + '.userType'" style="width:23%">
                  <el-select v-model="item.userType" placeholder="请选择">
                    <el-option label="个人" :value="0" />
                    <el-option label="私人企业" :value="1" />
                    <el-option label="国有重点企业" :value="2" />
                    <el-option label="组织机构" :value="3" />
                    <el-option label="事业单位" :value="4" />
                    <el-option label="普通局委办" :value="5" />
                    <el-option label="权力机构" :value="6" />
                  </el-select>
                </el-form-item>
                <el-form-item label="用户级别" :prop="'dataproductControlList.' + index + '.userLevel'"
                              style="width:23%"
                >
                  <el-select v-model="item.userLevel" placeholder="请选择">
                    <el-option label="最低级用户" :value="0" />
                    <el-option label="低级用户" :value="1" />
                    <el-option label="中级用户" :value="2" />
                    <el-option label="高级用户" :value="3" />
                    <el-option label="最高级用户" :value="4" />
                  </el-select>
                </el-form-item>
                <el-form-item label="是否可以试用" :prop="'dataproductExtendList.' + index + '.isTry'"
                              style="width:23%"
                >
                  <el-select v-model="item.isTry" placeholder="请选择">
                    <el-option label="可以" :value="0" />
                    <el-option label="不可以" :value="1" />
                  </el-select>
                </el-form-item>
                <el-form-item label="购买是否需要审核" :prop="'dataproductExtendList.' + index + '.isAudit'"
                              style="width:22%"
                >
                  <el-select v-model="item.isAudit" placeholder="请选择">
                    <el-option label="需要" :value="0" />
                    <el-option label="不需要" :value="1" />
                  </el-select>
                </el-form-item>
                <el-form-item style="width:40px">
                  <i class="el-icon-circle-plus" @click="addExtendList()" style="font-size:20px;margin-right:10px"></i>
                  <i class="el-icon-remove" @click="deleteExtendList(item, index)" style="font-size:20px"></i>
                </el-form-item>
                <!-- <el-button @click="addExtendList" type="primary">增加</el-button> -->
              </div>
            </el-form>
          </el-form-item>

        </div>
      </el-form>
      <div slot="footer" class="dialog-footer" prop="status">
        <el-button type="primary" @click="saveForm">保 存</el-button>
        <el-button type="primary" @click="submitForm">提 交</el-button>
        <el-button @click="updateOpen = false">取消</el-button>
      </div>
    </el-dialog>
    <!-- 查看简单产品 -->
    <el-dialog :title="title1" :visible.sync="open1" width="1200px" append-to-body>
      <el-form ref="form" :model="form">
        <el-form label-width="100px">
          <el-col :span="6">
            <el-form-item label="产品名称：">{{ form.productName }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="产品简介：">{{ form.brief }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="所属分类：">
              <span v-for="(item,index) in form.productTypeList" :key="index"> {{ item.typeName }} &nbsp;&nbsp;</span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="关键字：">{{ form.keyword }}</el-form-item>
          </el-col>
          <el-col :span="30">
            <el-form-item label="产品定义：">{{ form.definition }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="详细说明：">{{ form.detaile }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="编程说明：">{{ form.programming }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="数据通道：">
                  <span v-for="(item,index) in AllDatasourceBaseList" :key="index">
                    <span v-if="item.id==form.sourceId">
                      {{ item.resourceName }}
                    </span>
                  </span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="允许试用：">{{ isTry[form.isTry] }}</el-form-item>
          </el-col>
          <!-- <el-col :span="12">
              <el-form-item label="文件地址：">{{ isTry[form.isTry] }}</el-form-item>
          </el-col> -->
        </el-form>
        <h3 style="font-weight:bolder;">参数设置</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductParamList" :key="index">
            <el-row>
              <el-col :span="4">
                <el-form-item label="参数名称：" :prop="'dataproductParamList.' + index + '.paramName'">
                  {{ item.paramName }}
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-form-item label="参数KEY：" :prop="'dataproductParamList.' + index + '.paramKey'">
                  {{ item.paramKey }}
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-form-item label="是否可选：" :prop="'dataproductParamList.' + index + '.chooseType'">
                  {{ chooseType[item.chooseType] }}
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-form-item label="关系类型：" :prop="'dataproductParamList.' + index + '.relationshipType'">
                  {{ relationshipType[item.relationshipType] }}
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-form-item label="备注说明：" :prop="'dataproductParamList.' + index + '.remark'">
                  {{ item.remark }}
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;">价格设置</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductPriceList" :key="index">
            <el-row>
              <el-col :span="6">
                <el-form-item label="特定用户：" :prop="'dataproductPriceList.' + index + '.userId'">
                    <span v-for="(item1,index1) in AllUserInfoList" :key="index1">
                      <span v-if="item1.userId==item.userId">
                        {{ item1.nickName }}
                      </span>
                    </span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="用户类型：" :prop="'dataproductPriceList.' + index + '.userType'">
                  {{ userType[item.userType] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="用户级别：" :prop="'dataproductPriceList.' + index + '.userLevel'">
                  {{ userLevel[item.userLevel] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="计费类别：" :prop="'dataproductPriceList.' + index + '.billingType'">
                  {{ billingType[item.billingType] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="使用周期：" :prop="'dataproductPriceList.' + index + '.usePeriod'">
                  {{ item.usePeriod }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="计费单位：" :prop="'dataproductPriceList.' + index + '.productUnit'">
                  {{ item.productUnit }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="价格设置：" :prop="'dataproductPriceList.' + index + '.price'">
                  {{ item.price }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="备注说明：" :prop="'dataproductPriceList.' + index + '.remark'">
                  {{ item.remark }}
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;">访问控制</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductControlList" :key="index">
            <el-col :span="4">
              <el-form-item label="特定用户：" :prop="'dataproductControlList.' + index + '.userId'">
                  <span v-for="(item1,index1) in AllUserInfoList" :key="index1">
                    <span v-if="item1.userId==item.userId">
                      {{ item1.nickName }}
                    </span>
                  </span>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="用户类型：" :prop="'dataproductControlList.' + index + '.userType'">
                {{ userType[item.userType] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="用户级别：" :prop="'dataproductControlList.' + index + '.userLevel'">
                {{ userLevel[item.userLevel] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="共享级别：" :prop="'dataproductControlList.' + index + '.sharedType'">
                {{ shareType[item.sharedType] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="查询可见：" :prop="'dataproductControlList.' + index + '.isVisible'">
                {{ isVisible[item.isVisible] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="说明：" :prop="'dataproductControlList.' + index + '.remark'">
                {{ item.remark }}
              </el-form-item>
            </el-col>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;">扩展控制</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductExtendList" :key="index">
            <el-col :span="8">
              <el-form-item label="用户类型：" :prop="'dataproductExtendList.' + index + '.userType'">
                {{ userType[item.userType] }}
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="用户级别：" :prop="'dataproductExtendList.' + index + '.userLevel'">
                {{ userLevel[item.userLevel] }}
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="购买是否需要审核：" :prop="'dataproductExtendList.' + index + '.isAudit'"
                            label-width="140px"
              >
                {{ isAudit[item.isAudit] }}
              </el-form-item>
            </el-col>
          </div>
        </el-form>
      </el-form>

      <div slot="footer" class="dialog-footer" prop="status">
        <el-button type="primary" @click="open1 = false">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 查看复杂产品 -->
    <el-dialog :title="title2" :visible.sync="open2" width="1200px" append-to-body>
      <el-form ref="form" :model="form">
        <el-form label-width="100px">
          <el-col :span="6">
            <el-form-item label="产品名称：">{{ form.productName }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="所属分类："><span v-for="(item,index) in form.productTypeList" :key="index"
            > {{ item.typeName }} &nbsp;&nbsp;</span></el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="产品简介：">{{ form.brief }}</el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="详细说明：">{{ form.detaile }}</el-form-item>
          </el-col>
        </el-form>
        <h3 style="font-weight:bolder;text-align:center">价格设置</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductPriceList" :key="index">
            <el-row>
              <el-col :span="6">
                <el-form-item label="特定用户：" :prop="'dataproductPriceList.' + index + '.userId'">
                  <span v-for="(item1,index1) in AllUserInfoList" :key="index1">
                    <span v-if="item1.userId==item.userId">
                      {{ item1.nickName }}
                    </span>
                  </span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="用户类型：" :prop="'dataproductPriceList.' + index + '.userType'">
                  {{ userType[item.userType] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="用户级别：" :prop="'dataproductPriceList.' + index + '.userLevel'">
                  {{ userLevel[item.userLevel] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="计费类别：" :prop="'dataproductPriceList.' + index + '.billingType'">
                  {{ billingType[item.billingType] }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="使用周期：" :prop="'dataproductPriceList.' + index + '.usePeriod'">
                  {{ item.usePeriod }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="计费单位：" :prop="'dataproductPriceList.' + index + '.productUnit'">
                  {{ item.productUnit }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="价格设置：" :prop="'dataproductPriceList.' + index + '.price'">
                  {{ item.price }}
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="备注说明：" :prop="'dataproductPriceList.' + index + '.remark'">
                  {{ item.remark }}
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;text-align:center">访问控制</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductControlList" :key="index">
            <el-col :span="4">
              <el-form-item label="特定用户：" :prop="'dataproductControlList.' + index + '.userId'">
                <span v-for="(item1,index1) in AllUserInfoList" :key="index1">
                  <span v-if="item1.userId==item.userId">
                    {{ item1.nickName }}
                  </span>
                </span>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="用户类型：" :prop="'dataproductControlList.' + index + '.userType'">
                {{ userType[item.userType] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="用户级别：" :prop="'dataproductControlList.' + index + '.userLevel'">
                {{ userLevel[item.userLevel] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="共享级别：" :prop="'dataproductControlList.' + index + '.sharedType'">
                {{ shareType[item.sharedType] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="查询可见：" :prop="'dataproductControlList.' + index + '.isVisible'">
                {{ isVisible[item.isVisible] }}
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="说明：" :prop="'dataproductControlList.' + index + '.remark'">
                {{ item.remark }}
              </el-form-item>
            </el-col>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;text-align:center">产品设置</h3>
        <el-form label-width="110px">
          <div v-for="(item,index) in form.productLinkList" :key="index">
            <el-col :span="12">
              <el-form-item label="产品子项：" :prop="'productLinkList.' + index + '.productSonId'">
                <!-- {{ item.productSonId }} -->
                <span v-for="(item1,index1) in AllDataProductList" :key="index1">
                  <span v-if="item1.id==item.productSonId">
                    {{ item1.productName }}
                  </span>
                </span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="价格占比：" :prop="'productLinkList.' + index + '.packagePriceRatio'">
                {{ item.packagePriceRatio + '%' }}
              </el-form-item>
            </el-col>
          </div>
        </el-form>
        <h3 style="font-weight:bolder;text-align:center">扩展控制</h3>
        <el-form label-width="100px">
          <div v-for="(item,index) in form.dataproductExtendList" :key="index">
            <el-col :span="6">
              <el-form-item label="用户类型：" :prop="'dataproductExtendList.' + index + '.userType'">
                {{ userType[item.userType] }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="用户级别：" :prop="'dataproductExtendList.' + index + '.userLevel'">
                {{ userLevel[item.userLevel] }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="是否可以试用：" :prop="'dataproductExtendList.' + index + '.isTry'"
                            label-width="120px"
              >
                {{ isTry[item.isTry] }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="购买是否需要审核：" :prop="'dataproductExtendList.' + index + '.isAudit'"
                            label-width="140px"
              >
                {{ isAudit[item.isAudit] }}
              </el-form-item>
            </el-col>
          </div>
        </el-form>
      </el-form>

      <div slot="footer" class="dialog-footer" prop="status">
        <el-button type="primary" @click="open2 = false">确 定</el-button>
      </div>
    </el-dialog>
    <!--    测试数据产品-->
    <el-dialog :title="testTitle" :visible.sync="testOpen" width="1200px" append-to-body>
      <el-form ref="testForm" :model="testForm">
        <el-form-item label="输入输出参数设置" prop="fileUrl">
          <UploadFileOrPic :formObject="testForm" form-key="fileUrl" type="file" />
        </el-form-item>
        <el-button type="primary" @click="submitTest">确 定</el-button>
        <el-button type="primary" @click="testOpen = false">取消</el-button>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import {
  listDataProduct,
  getDataProduct,
  delDataProduct,
  addDataProduct,
  updateDataProduct,
  operatedataProduct,
  executeProduct,
  listAllDataProduct
} from '@/api/qysj/app/DataProduct.js'
import { listAllDatasourceBase, MenuSystem } from '@/api/qysj/app/DatasourceBase.js'
import { listAllProductType } from '@/api/qysj/app/ProductType.js'
import { listUser } from '@/api/system/user'
import MultiLevelMenu from '@/views/qysj/data/source/MultiLevelMenu.vue'
import { listAllFieldType, listFieldType } from '@/api/qysj/app/FieldType'
import { DataBaseSelList } from '@/api/qysj/app/DataBaseInfo'
import FieldAndKeyword from '@/views/qysj/data/components/FieldAndKeyword.vue'
import { buyRuleList } from '@/api/qysj/app/buyRule'
import UploadFileOrPic from '@/views/qysj/data/components/UploadFileOrPic.vue'
import el from 'element-ui/src/locale/lang/el'

export default {
  name: 'DataProduct',
  components: { UploadFileOrPic, FieldAndKeyword, MultiLevelMenu },
  data() {
    return {
      ad: true,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 引擎信息信息表格数据
      DataProductList: [],
      multipleSelection: [], // 多选数据
      typeIdList: [],
      // 弹出层标题
      updateTitle: '',//添加或修改弹窗
      testTitle: '',//测试弹窗
      title1: '',
      title2: '',
      // 是否显示弹出层
      updateOpen: false,//添加或修改弹窗
      open1: false,
      open2: false,
      testOpen: false,//测试产品
      // 测试弹窗表单
      testForm: {},
      // 查询数据产品参数
      productQueryParams: {
        pageNum: 1,
        pageSize: 10,
        auditId: null,
        startTime: null,
        endTime: null,
        name: null,
        createUserId: null,
        type: null,
        unit: null,
        price: null,
        status: null,
        keyword: null,
        sourceType: null,//产品类型
        systemCatalogId: null,//目录体系Id
        systemFieldId: null//目录id
      },
      queryParams2: {
        pageNum: 1,
        pageSize: 10,
        ownUserId: window.sessionStorage.getItem('UserId')
      },
      queryParams1: {
        pageNum: 1,
        pageSize: 10,
        ownUserId: window.sessionStorage.getItem('UserId'),
        status: 0
      },
      // 产品表单参数
      productForm: {
        dataproductParamList: [],
        exportParam: '[]',
        productLinkList: [],
        createType: 2,//管理员创建
        generationMode: 2,//平台定义
        sourceType: 1//默认选择在线数据产品
      },
      exportParam: [],
      buyRuleList: [],
      // 表单校验
      rules: {
        auditId: [
          { required: true, message: '审核Id不能为空', trigger: 'blur' }
        ],
        createUserId: [
          { required: true, message: '创建用户ID不能为空', trigger: 'blur' }
        ]
      },
      //TODO 数据产品注册或修改表单校验
      // 数据产品注册或修改表单校验
      productRules: {},
      AllDatasourceBaseList: [],
      AllProductTypeList: [],
      disabled: false,
      AllUserInfoList: [],
      AllDataProductList: [],
      // 是否可选
      chooseType: {
        0: '不能',
        1: '能'
      },
      // 关系类型
      relationshipType: {
        0: '等于',
        1: '大于',
        2: '小于',
        4: '包含',
        8: '除外'
      },
      // 用户类型
      userType: {
        0: '个人',
        1: '私人企业',
        2: '国有重点企业',
        3: '组织机构',
        4: '事业单位',
        5: '普通局委办',
        6: '权力机构'
      },
      // 用户级别
      userLevel: {
        0: '最低级用户',
        1: '低级用户',
        2: '中级用户',
        3: '高级用户',
        4: '最高级用户'
      },
      // 计费类别
      billingType: {
        0: '按次数',
        1: '按记录数',
        2: '按字节',
        3: '按时长'
      },
      //查询可见
      isVisible: {
        0: '可见',
        1: '不可见'
      },
      // 共享类型
      shareType: {
        0: '无条件共享',
        1: '需要授权',
        2: '需要确权',
        3: '需要确认授权'
      },
      // 购买是否需要审核
      isAudit: {
        0: '不需要',
        1: '需要'
      },
      // 是否可以试用
      isTry: {
        0: '不可以',
        1: '可以'
      },
      // 目录
      activeMenuIndex: '1',
      // 目录查询参数
      menuQueryParams: {
        // pageNum: 1,
        // pageSize: 10,
        keyword: null,
        parentId: 0,
        systemCatalogId: null,
        catalogTypes: '0,1,2'
      },
      // 目录
      menu: [],
      // 数据通道列表
      dataSourceList: [],
      form: {},
      // 套餐产品的产品选择下拉列表
      dataProductList: [],
      // // 关键词列表
      // keywordList:[]
      // 申购规则类型
      buyRuleType: -1
    }
  },
  created() {
    this.getProductList()
    this.getMenuTopList()
    this.getDataSourceList()
    this.getBuyRuleList()
    this.getDataProductList()
  },
  methods: {
    // 获取顶级目录体系
    getMenuTopList() {
      listAllFieldType(this.menuQueryParams).then(res => {
        if (res.code === 200) {
          // this.menu = res.data.map((item,index) => {
          //   const { id, ...rest } = item;
          //   return {
          //     id:0,//表示是目录体系
          //     ...rest
          //   };
          // });
          for (let i = 0; i < res.data.length; i++) {
            if (res.data[i].childrenList) {
              res.data[i].childrenList = res.data[i].childrenList.map(item => {
                if (item.exitSon !== 0) {
                  return {
                    ...item,
                    childrenList: []
                  }
                } else {
                  return {
                    ...item
                  }
                }
              })
            }
          }
          this.menu = res.data
          console.log(' this.menu', this.menu)
        }
      })
    },
    // 目录展开事件
    handleMenuOpen(index) {
      let currentMenu = this.getCurrentMenu(index)
      this.menuQueryParams.systemCatalogId = currentMenu.systemCatalogId
      if (currentMenu.id === 10000 || currentMenu.id === 10001) {
        this.menuQueryParams.parentId = 0
      } else {
        this.menuQueryParams.parentId = currentMenu.id
      }
      if (currentMenu.childrenList.length === 0) {
        listAllFieldType(this.menuQueryParams).then(res => {
          if (res.code === 200) {
            const childrenList = res.data.map(item => {
              if (item.exitSon !== 0) {
                return {
                  ...item,
                  childrenList: []
                }
              } else {
                return {
                  ...item
                }
              }
            })
            this.$set(currentMenu, 'childrenList', childrenList)
            // 筛选对应数据资源
            this.productQueryParams.systemCatalogId = currentMenu.systemCatalogId
            this.productQueryParams.systemFieldId = currentMenu.id
            this.getProductList()
            console.log('this.menu', this.menu)
          } else {
            this.$message('获取子目录失败')
          }
        })
      }
    },
    // 子叶目录节点点击事件
    handleItemSel(index) {
      let currentMenu = this.getCurrentMenu(index)
      this.productQueryParams.systemCatalogId = currentMenu.systemCatalogId
      this.productQueryParams.systemFieldId = currentMenu.id
      this.getProductList()
    },
    // 根据index路径获取当前的目录对象
    getCurrentMenu(index) {
      const arr = index.split('-').map(Number)
      let currentMenu = null
      for (let i = 0; i < arr.length; i++) {
        if (i === 0) {
          currentMenu = this.menu[arr[i]]
        } else {
          if (currentMenu && currentMenu.childrenList && currentMenu.childrenList.length > 0) {
            currentMenu = currentMenu.childrenList[arr[i]]
          }
        }
      }
      return currentMenu
    },
    /** 查询数据产品信息列表 */
    getProductList() {
      this.loading = true
      listDataProduct(this.productQueryParams).then((response) => {
        this.DataProductList = response.rows
        // console.log(this.DataProductList)
        this.total = response.total
        this.loading = false
      })
      // listAllDataProduct(this.queryParams1).then((response) => {
      //   this.AllDataProductList = response.data;
      //   console.log(this.AllDataProductList);
      // });
      // listAllDatasourceBase(this.queryParams2).then((response) => {
      //   this.AllDatasourceBaseList = response.data;
      // });
      // listAllProductType(this.productQueryParams).then((response) => {
      //   this.AllProductTypeList = response.data;
      // });
      // listUser(this.productQueryParams).then((response) => {
      //   this.AllUserInfoList = response.rows;
      // });
    },
    getBuyRuleList() {
      buyRuleList().then(res => {
        if (res.code === 200) {
          this.buyRuleList = res.rows
        } else {
          this.$message('获取申购规则列表失败')
        }
      })
    },
    // 产品列表请求 获取自己的数据产品，在套餐产品注册的时候选择
    getDataProductList() {
      listAllDataProduct({
        ownUserId: sessionStorage.getItem('userId'),
        sourceTypeList: '1,4'//数据产品
      }).then(res => {
        if (res.code === 200) {
          this.dataProductList = res.data
        } else {
          this.$message('获取数据产品下拉列表失败')
        }
      })
    },
    // 监听状态下拉框选中
    handleStatusSel(selectedValue) {
      this.productQueryParams.status = selectedValue
      this.getProductList()
    },
    // 监听产品类型下拉框选中
    handleSourceTypeSel(selectedValue) {
      this.productQueryParams.sourceType = selectedValue
      this.getProductList()
    },
    // 获取数据通道下拉列表
    getDataSourceList() {
      DataBaseSelList({
        status: 0,
        ownUserId: sessionStorage.getItem('UserId')
      }).then(res => {
        if (res.code === 200) {
          this.dataSourceList = res.data
        } else {
          this.$message('获取数据通道下拉列表错误')
        }
      })
    },
    // 输入参数新增按钮
    handleInputParamAdd() {
      this.productForm.dataproductParamList.push({
        paramName: '',
        paramKey: '',
        paramType: '',
        paramDefault: '',
        // relationshipType:'',
        remark: ''
        // productId:''
      })
    },
    // 输入参数删除按钮
    handleInputParamDelete(index) {
      this.productForm.dataproductParamList.splice(index, 1)
    },
    // 输出参数新增按钮
    handleOutputParamAdd() {
      this.exportParam.push({
          paramName: '',
          paramKey: '',
          paramType: '',
          // chooseType:'',
          // relationshipType:'',
          remark: ''
          // productId:''
        }
      )
    },
    // 输出参数新增按钮
    handleOutputParamDelete(index) {
      this.exportParam.splice(index, 1)
    },
    // 产品新增按钮
    handleProductAdd() {
      this.productForm.productLinkList.push({
        packagePriceRatio: '',
        productSonId: ''
      })
    },
    // 产品删除按钮
    handleProductDelete(index) {
      this.productForm.productLinkList.splice(index, 1)
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.productForm = {
        brief: '',
        createType: '0',
        customRequestId: '',
        isTry: null,
        isAudit: null,
        definition: '',
        detail: '',
        generationMode: '0',
        inputUserId: '',
        ownUserId: '',
        productLinkList: [
          {
            packagePriceRatio: '',
            productSonId: ''
          }
        ],
        productName: '',
        programming: '',
        sourceId: '',
        status: '0',
        typeIdList: [],
        sourceType: 1,
        dataproductParamList: [
          {
            paramName: '',
            paramKey: '',
            paramType: '',
            // chooseType:'',
            // relationshipType:'',
            paramDefault: '',
            remark: ''
            // productId:''
          }
        ]
      }
      this.resetForm('form')
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.productQueryParams.pageNum = 1
      console.log(this.productQueryParams)
      this.getProductList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增产品按钮操作 */
    handleAdd() {
      this.reset()
      this.disabled = false
      this.updateTitle = '添加产品信息'
      this.updateOpen = true
    },
    // // 更新图片或者文件绑定的url
    // updateParentValue(value){
    //   this.productForm.iconUrl=value;
    // },
    // // 更新图片或者文件绑定的url
    // updateOfflineFileUrl(value){
    //   this.productForm.offlineFileUrl=value
    // },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.disabled = true
      console.log(row)
      const id = row.id || this.ids
      getDataProduct(id).then((response) => {
        this.productForm = response.data
        console.log(this.productForm)
        this.updateOpen = true
        this.updateTitle = '修改数据产品信息'
      })
    },
    //上下架
    handleUp(row) {
      let data = {
        id: row.id,
        status: row.status === 0 ? -1 : 1
      }
      operatedataProduct(data).then((response) => {
        this.$modal.msgSuccess('修改成功')
        this.getProductList()
      })
    },
    //TODO 执行测试
    handleExecute(row) {
      this.testTitle = '测试产品'
      this.testOpen = true
      console.log('row', row)
      this.testForm = {
        'fileUrl': '',
        'input': {},
        'productId': row.id,
        'type': 1
      }
      // let data = {
      //   applicationId: 0,
      //   input: {},
      //   productId: 0,
      //   sourceId: row.Id,
      //   type: 0,
      //   userId: 0,
      // };
      // executeProduct(data).then((response) => {
      //   this.$modal.msgSuccess("执行成功");
      //   this.getProductList();
      // });
    },
    // 提交测试
    submitTest() {
      executeProduct(JSON.stringify(this.testForm)).then((res) => {
        if (res.code === 200 && res.data.RetCode === 0) {
          this.$modal.msgSuccess('执行成功')
          this.getProductList()
          this.testOpen = false
        } else {
          const msg = res.data.ErrorMsg || res.msg || '测试失败'
          this.$modal.msgError(msg)
          this.testOpen = false
        }
      })
    },
    // 查看信息
    handleSee(row) {
      this.reset()
      const id = row.id || this.ids
      getDataProduct(id).then((response) => {
        console.log(response)
        this.form = response.data
        if (this.form.sourceType == 1) {
          this.form = response.data
          console.log(this.form)
          this.open1 = true
          this.title1 = '简单产品基本信息'
        } else if (this.form.sourceType == 2) {
          this.form = response.data
          console.log(this.form)
          this.open2 = true
          this.title2 = '复杂产品基本信息'
        }

      })
    },
    // 保存
    saveForm() {
      this.$refs['productForm'].validate((valid) => {
        this.productForm.status = -1
        this.productForm.generationMode = 0
        this.form.ownUserId = sessionStorage.getItem('UserId')
        this.productForm.createType = 0
        this.productForm.inputUserId = this.productForm.inputUserId || sessionStorage.getItem('UserId')
        //控制规则
        if (this.productForm.sourceType === 1) {
          this.productForm.controlRuleId = 0
        } else if (this.productForm.sourceType === 2) {
          this.productForm.controlRuleId = -1
        } else if (this.productForm.sourceType === 4) {
          this.productForm.controlRuleId = -1
        }
        // 申购规则处理
        if (this.buyRuleType === 0 || this.buyRuleType === -1) {
          this.productForm.buyRuleId = this.buyRuleType
        }
        // 输出参数转换
        if (this.exportParam) {
          this.productForm.exportParam = JSON.stringify(this.exportParam)
        }
        if (valid) {
          addDataProduct(this.form).then((response) => {
            if (response.code === 200) {
              this.$modal.msgSuccess('保存成功')
              this.updateOpen = false
              this.getProductList()
            }
          })
        }
      })
    },
    /** 修改或新增产品提交按钮 */
    submitForm() {
      this.$refs['productForm'].validate((valid) => {
        console.log(this.productForm)
        this.productForm.status = 2
        //控制规则
        if (this.productForm.sourceType === 1) {
          this.productForm.controlRuleId = 0
        } else if (this.productForm.sourceType === 2) {
          this.productForm.controlRuleId = -1
        } else if (this.productForm.sourceType === 4) {
          this.productForm.controlRuleId = -1
        }
        // 申购规则处理
        if (this.buyRuleType === 0 || this.buyRuleType === -1) {
          this.productForm.buyRuleId = this.buyRuleType
        }
        // 输出参数转换
        if (this.exportParam) {
          this.productForm.exportParam = JSON.stringify(this.exportParam)
        }
        if (valid) {
          // 修改
          if (this.productForm.id != null) {
            console.log('this.productForm', this.productForm)
            updateDataProduct(this.productForm).then(res => {
              if (res.code === 200) {
                this.$modal.msgSuccess('修改成功')
                this.updateOpen = false
                this.getProductList()
                this.reset()
              } else {
                this.$modal.msgError(res.msg)
              }
            })
          } else {
            //新增
            addDataProduct(this.productForm).then(res => {
              if (res.code === 200) {
                this.$modal.msgSuccess('新增成功')
                this.updateOpen = false
                this.getProductList()
                this.reset()
              } else {
                this.$modal.msgError(res.msg)
              }
            })
          }
        }
      })
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids
      console.log(ids)
      this.$modal
        .confirm('是否确认删除产品名称为"' + row.productName + '"的数据项？')
        .then(function() {
          return delDataProduct(ids)
        })
        .then(() => {
          this.getProductList()
          this.$modal.msgSuccess('删除成功')
        })
        .catch(() => {
        })
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        'dataProduct/export',
        {
          ...this.productQueryParams
        },
        `DataProduct_${new Date().getTime()}.xlsx`
      )
    },
    handelPush() {
    },
    // 新增
    addControlList(index) {
      this.$refs['form'].validate((valid) => {
        // alert('submit!');
        this.form.dataproductControlList.push({
          ...this.form.dataproductControlList[index],
          userId: '',
          userType: '',
          userLevel: '',
          sharedType: '',
          isVisible: '',
          type: ''
        })
      })
    },
    // 删除
    deleteControlList(item, index) {
      this.form.dataproductControlList.splice(index, 1)
    },
    addPriceList(index) {
      this.$refs['form'].validate((valid) => {
        // alert('submit!');
        this.form.dataproductPriceList.push({
          ...this.form.dataproductPriceList[index],
          userId: '',
          userType: '',
          userLevel: '',
          billingType: '',
          usePeriod: '',
          productUnit: '',
          price: '',
          remark: ''
        })
      })
    },

    // 删除
    deletePriceList(item, index) {
      this.form.dataproductPriceList.splice(index, 1)
    },
    addLinkList(index) {
      this.$refs['form'].validate((valid) => {
        // alert('submit!');
        this.form.productLinkList.push({
          ...this.form.productLinkList[index],
          userId: '',
          packagePriceRatio: '',
          productId: '',
          productSonId: ''
        })
      })
    },
    // 删除
    deleteLinkList(item, index) {
      this.form.productLinkList.splice(index, 1)
    },
    addExtendList(index) {
      this.$refs['form'].validate((valid) => {
        // alert('submit!');
        this.form.dataproductExtendList.push({
          ...this.form.dataproductExtendList[index],
          isAudit: '',
          isTry: 1,
          userType: '',
          userLevel: ''
        })
      })
    },
    // 删除
    deleteExtendList(item, index) {
      this.form.dataproductExtendList.splice(index, 1)
    },
    addParamList(index) {
      this.$refs['form'].validate((valid) => {
        // alert('submit!');
        this.form.dataproductParamList.push({
          ...this.form.dataproductParamList[index],
          chooseType: 0,
          paramKey: '',
          paramName: '',
          productId: 0,
          relationshipType: 0,
          remark: ''
        })
      })
    },
    // 删除
    deleteParamList(item, index) {
      this.form.dataproductParamList.splice(index, 1)
    }
  }
}
</script>
<style scoped>

.el-form-item {
  margin-bottom: 10px !important;
}

</style>
<style>
.el-tooltip__popper {
  max-width: 500px !important;
}
</style>
